<template>
	<!-- <aside v-if="param.student"> -->
		<el-dialog	
			  v-if="param.student"
			  class="attendanceDialogOrder"
			  :visible.sync="param.show"
			  :close-on-click-modal="param.modalclose"
			  :modal="false"	
			  :before-close="closeDialog"
			   element-loading-background="rgba(0, 0, 0, 0.5)"
			  custom-class="attendanceOrder"			  
			  >
			  <div class="title">({{param.student.realName}})考勤</div>
			  <div class="content-box">
			  		<div class="tablecss">
	              		<table   border="0" style="width:100%;" cellpadding="0" cellspacing="0">
			      			<thead >
			      				<tr >
			      					<th>考勤日期</th>
			      					<th>班级名称</th>
			      					<th>教师</th>
			      					<th>考勤状态</th>	
			      					<th>签到人</th>					      						      					
			      				</tr>				      				
			      			</thead>
			      			<tbody  v-if="param.attendlist.length>0">
			      				<tr v-for="li in param.attendlist">
			      					<td align="center">{{li.signinTime}}</td>
			      					<td align="center">{{li.className}}</td>
			      					<td align="center">{{li.teacherUserName||""}}</td>
			      					<td align="center">
			      						<span v-if="li.signinMode==3" style="color: red;">{{param.signinmode[li.signinMode]}}</span>
			      						<span v-else>{{param.signinmode[li.signinMode]}}</span>
			      					</td>	
			      					<td align="center">{{li.siginUserName}}</td>					      								      					
			      				</tr>	      				
			      			</tbody>
			      			<tbody  v-else>
				      				<tr>
				      					<td colspan="11" align="center">暂无数据</td>
				      				</tr>
				      		</tbody>
		      		    </table>
			      	</div>
			   </div>
			  <div class="pagePanel">
			    	<el-pagination	 
			    	  class="page"	
			    	  @current-change="curChange"
				      @size-change="pageSizeChange"
				      :page-size="pager.pagesize"	
				      :current-page="pager.currpage"
				      layout="total, sizes, prev, pager, next, jumper"
				      :total="pager.totalnum">
		    		</el-pagination>
	    	   </div>
		</el-dialog>
	<!-- </aside>		 -->
</template>

<script>
	let vm;
	export default{
		data(){
			return {
				param:{
					show:false,
					modalclose:false,
					student:{},
					signinmode:{},
					attendlist:[],				
				},
				pager:{
					totalnum:0,
					pagesize:10,
					currpage:1,
				}
			}
		},
		methods:{
			/**
			 * 初始化
			 * @param type 1-当月考勤；2-上月考勤
			 */
			init(studentId,realName,type){
				this.timeType=type;
			    vm.param.show = true;
			    vm.param.student = {studentId:studentId,realName:realName};
			     //考勤数据字典			   
				let dicdata = tool.getItem(lsKey.dict,true);
				let signinmodelist = dicdata["signin_mode"];//获取课程状态数据字典列表
				
				for(let i=0;i<signinmodelist.length;i++){
					this.param.signinmode[signinmodelist[i]["value"]] = signinmodelist[i]["name"];
				}
			    this.searchData();
				    
			},
			/**
			 * 获取数据列表
			 */
			searchData(){
				
			    let sTime = '';
				let eTime = '';
				//当月
				if(this.timeType===1){
					let timeobj=tool.getTimeObjByType(3);
					sTime=timeobj.startTime;
					eTime=timeobj.endTime;
				}
				//上月
				else{
					let timeobj=tool.getTimeObjByType(33);
					sTime=timeobj.startTime;
					eTime=timeobj.endTime;
				}

			    let param = {
			    	campusId:vm.$store.state.campusId,		    	
			    	studentId:vm.param.student.studentId,
			    	keyName:'',
			    	startTime:sTime,
			    	endTime:eTime,
			    	currPage:this.pager.currpage,
					pageSize:this.pager.pagesize,
			    }			
			    api.getAttendenceList(param).then(function(data){
			    	if(data.resultCode==2000){
			    		vm.pager.totalnum = data.totalCount;
			    		vm.param.attendlist = data.list;
			    	}
			    })
			},
			/**
			 * 当前页变化
			 */
			curChange(val){
				vm.pager.currpage = val;
				vm.searchData();
			},
			/**
			 * 页数变化
			 */
			pageSizeChange(val){
				vm.pager.pagesize = val;
				vm.searchData();
			},
			/**
			 * 关掉
			 */
			closeDialog(){
				vm.param.show = false;
			//	vm.$emit('closeDialog');
			}
		},
		mounted(){
			vm = this;
		}
	}
</script>

<style lang="scss">
	@import "@/style/module/utils.scss";
	.attendanceOrder{
		// width:8rem !important;;
		// border-radius: .1rem !important;;	
		// margin-top:10vh !important;
		
	}
	.attendanceDialogOrder{
		// z-index: 30 !important;
        // top: 0.81rem !important;
        // left: 2.1rem !important;
        background-color:rgba(0,0,0,0.5);
		.el-dialog__header{
			padding: 0px;
		}
		.el-dialog__body{
			padding: 0px !important;
		}	
		.el-dialog__footer{
			padding: .3rem;
			.footer-btn{
				width:100%;
				text-align: center;
			}									
		}
		
		.title{
			width:100%;
			height: 0.6rem;
			padding: 0.2rem 0.3rem;
			font-size: 0.2rem;
			font-weight: bold;					
		}
		.content-box{
			width:100%;
			height: auto;
			padding: 0.2rem 0.3rem;
		}
		.pagePanel{
			width:100%;
			height: auto;
			padding: 0.2rem 0.3rem;
		}
	}
</style>